<template>
  <view class="custom-stamp">
    <!-- 标题行 -->
    <view class="title-row">
      <view class="checkbox-wrapper">
              <evan-checkbox 
                @change="handleCheckChange"
              >是否启用电子签章功能</evan-checkbox>
      </view>
    </view>

    <!-- 签章区域 -->
    <view  class="stamp-area" @click="handleStampClick">
      <text class="stamp-text">{{ stampText }}</text>
    </view>
  </view>
</template>

<script>
export default {
  name: 'StampSection',
   props: {
     stampText: {
       type: String,
       default: '+点此签章'
     }, // 由父组件控制签章状态
    stampEnabled: {
      type: Boolean,
      default: false
    }
   },
   data() {
     return {

     };
   },
   methods: {
     handleStampClick() {
       this.$emit('stamp-click');
     }
   }
 }
</script>

<style scoped>
.custom-stamp {
  width: 100%;
  margin: 24rpx auto;
  padding: 12rpx;
  background: #fff;
  position: relative;
}

.title-row {
  display: flex;
  justify-content: flex-end; /* 将内容靠右对齐 */
  align-items: center;
  margin-bottom: 30rpx;
}

.title {
  font-size: 28rpx;
  color: #333;
  font-weight: 500;
}

.checkbox-wrapper {
  display: flex;
   justify-content: flex-end; /* 确保内部内容靠右 */
   width: 100%; /* 占据整个宽度以便右对齐 */
}

.stamp-area {
  width: 100%;
  height: 120rpx;
  border: 2rpx dashed #0055ff;
  border-radius: 10rpx;
  background: #e5ecff;
  display: flex;
  justify-content: center;
  align-items: center;
}

.stamp-text {
  font-size: 24rpx;
  font-weight: bold;
  color: #000000;
}
</style>